let id = 0
export class Dep {
  constructor() {
    this.id = id++
    this.subs = []
  }
  depend() {
    if (Dep.target) {
      /*this.addSub(Dep.target)
      * 将Dep与Watcher关联起来
      * 在watcher中对subs进行操作,这样避免重复去重
      * */
      Dep.target.addDep(this)
    }
  }
  addSub(watcher) {
    this.subs.push(watcher)
    watcher.addDep(this)
  }
  notify() {
    this.subs.forEach((watcher) => watcher.update())
  }
}
Dep.target = null
//只有根组件(每个属性都有一个dep)
//1.vue里面用到了观察者模式,默认组件渲染的时候会创建一个watcher,并且会渲染视图
//2.当渲染视图的时候,会取data中数据,会走每个属性的get方法,让每个属性的dep去记录watcher
//3同时让watcher记住dep,(watcher和dep是多对多的关系,一个属性可以对应多个视图,一个视图也可以有多个属性)
//4.如果属性变化,会通知关联的watcher去进行视图更新
